<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/html/axios.min.js"></script>
    <script src="/html/util.js"></script>
    <script>
        var id = getQuery("id");
        window.onload = function (){
            showProduct();
        }
        function showProduct(){
            axios.get("/product/findById",{
                params:{
                    id
                }
            }).then(e=>{
                var info = e.data;
                $("productImg").src="/html/img/"+info.imgPath;
                $("nameSpan").innerHTML = info.name;
                $("priceSpan").innerHTML = info.price;

                var str = "";
                for(var i=0;i<info.speakList.length;i++){
                    var obj = info.speakList[i];
                    str += `<tr><td>${obj.user.name}</td><td>${obj.content}</td><td>${obj.speakDate}</td></tr>`;
                }
                $("speakData").innerHTML = str;
            });
        }

        function addSpeak(){
            axios.get("/speak/add",{
                params:{
                    productId:id,
                    content:$("content").value
                }
            }).then(e => {
                if(e.data == "ok"){
                    showProduct();
                }
                else{
                    location.href = "/html/login.html?errorLogin=no";
                }
            });
        }

    </script>
</head>
<body>
    <h2>商品详细信息</h2>
    <img src="" id="productImg" width="200" height="200"><br>
    商品名：<span id="nameSpan"></span><br>
    单价：<span id="priceSpan"></span><br>

    评论：
    <table border="1" cellspacing="0" width="60%">
        <thead><tr><th>评论人</th><th>评论内容</th><th>评论时间</th></tr></thead>
        <tbody id="speakData">

        </tbody>
    </table>
    发表评论：<br>
    评论内容：<input type="text" id="content"><br>
    <input type="button" value="添加评论" onclick="addSpeak()">
</body>
</html>